@charset "utf-8";




.web{
	width: 1366px;
	height: 2289px;
	
	header{
		
		
		.top{
			width: 100%;
			height: 40px;
			background-color: #212121;
			display: flex;
			
			.img{
				height: 23px;
				width: 85px;
				display: flex;
				justify-content: space-between;
				margin-left: 184px;
				margin-top: 10px;
				align-items: flex-end;
			}
			p{
				color: #bbbbbb;
				font-size: 12px;
				margin-left: 745px;
				margin-top: 20px;
			}
			
		}
		nav{
			// margin-bottom: 0;
			
			.con{
				
				
				
				.middle{
					display: flex;
					background-color: #FFFFFF;
					height: 100px;
					width: 100%;
					align-items: flex-end;
					padding-left: 276px;
					img{
						margin-right: 95px;
					}
					li{
						
						margin-right: 58px;
						font-size: 14px;
						a{
							text-decoration: none;
							color: #000000;
						}
					}
				}
				.logo{
					width: 60px;
					height: 100%;
					margin-right: 103px;
					padding-top: 5px;
				}
				
			}
				
		
		}
		.end{
			width: 1366px;
			height: 474px;
			// top: 0;
			// left: 0;
			margin-top: 14px;
			
			position: relative;
			// transform: translate(-50%,-50%);
			// padding-top: 28.1%;
			overflow: hidden;
			ul{
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				font-size: 0;
				white-space: nowrap;
				transition: all 1s;
				li{
					display: inline-block;
					width: 100%;
					
					img{
						width: 100%;
					}
				}
			}
			
			.arrow{
				width: 10%;
				height: 100%;
				position: absolute;
				top: 0;
				font-size: 20px;
				text-align: center;
				display: flex;
				justify-content: center;
				align-items: center;
				transition: all .8s;
				cursor: pointer;
			}
			.left_arrow{
				left: 0;
				background: linear-gradient(90deg,gray,transparent);
				transform: translateX(-100%) ;
			}
			.right_arrow{
				right: 0;
				background: linear-gradient(90deg,transparent,gray);
				transform: translateX(100%) ;
			}
			&:hover .arrow{
				transform: translateX(0) ;
				font-size: 60px;
			}
			
			&:hover ol{
				bottom: 10%;
			}
			
			ol{
				position: absolute;
				left: 50%;
				bottom: -10%;
				transform: translateX(-50%);
				font-size: 0;
				transition: all .5s;
				li{
					width: 12px;
					height: 12px;
					margin: 0 4px;
					background-color: orange;
					border-radius: 50%;
					display: inline-block;
					&:hover,&.active{
						background-color: #FF0000;
					}
				}
			}
		}
	
	}
	
	
	// 中部
	.section{
		height: 57%;
		width: 73%;
		margin-left: 183px;
		margin-top: 12px;
		.positi{
			width: 100%;
			height: 21px;
			display: flex;
			
			align-items: center;
			
			.zi{
				width: 113px;
				font-size: 16px;
				color: #000000;
				border-bottom: 1px solid #000000;
				text-align: center;
				font-weight: bold;
			}
			.two{
				background-color: #000000;
				width: 887px;;
				font-size: 14px;
				color: #ffffff;
			}
		}
		
		
		
		.box{
			width: 100%;
			height: 1277px;
			margin-top: 11px;
			display: flex;
			flex-wrap: wrap;
			.so{
				width: 16.8%;
				
				height: 555px;
				a{
					text-decoration: none;
					color: #222222;
				}
				.one{
					height: 65px;
					font-size: 18px;
					background-color: #eaeaea;
					line-height: 65px;
					border-bottom: 1px solid  #cfcfcf;
					padding-left: 20px;
					
					cursor: pointer;
					font-weight: bold;
					
				}
				
				.onet{
					width: 168px;
					height: 0;
					background-color: #212121;
					// display: none;
					overflow: hidden;
					transition: all .7s ease-in;
					h3{
						color: #f4f4f4;
						font-size: 12px;
						padding-top: 15px;
						padding-left: 20px;
					}
					.wt{
						width: 167px;
						height: 1px;
						border-bottom: 1px solid  #3c3c3c;
						padding-top: 14px;
					}
					li{
						padding-left: 20px;
						padding-top: 21px;
						
						font-size: 12px;
						
					}
					a{
						text-decoration: none;
						color: #999999;
					}
				}
				.two{
					font-size: 12px;
					border-bottom: 1px solid  #cfcfcf;
					background-color: #eaeaea;
					height: 45px;
					line-height: 45px;
					padding-left: 20px;
					
				}
				.twos{
					font-size: 12px;
					border-bottom: 1px solid  #cfcfcf;
					color: #222222;
					height: 65px;
					line-height: 65px;
					padding-left: 20px;
					background-color: #eaeaea; 
					
				}
				
			}
			
			
			
			
			
			
			.giant{
				width: 83.2%;
				
				.head{
					color: #b8b7b7;
					margin-top: 35px;
					font-size: 24px;
					height: 24px;
					
					text-align: center;
				}
				.heads{
					height: 36px;
					font-size: 36px;
					margin-top: 12px;
					text-align: center;
				}
				.third{
					height: 15px;
					font-size: 14px;
					color: #626262;
					margin-top: 17px;
					text-align: center;
				}
				.boxes{
					height: 292px ;
					display: flex;
					margin-top: 59px;
					margin-left: 60px;
					justify-content: space-between;
					width: 718px;
					.blank{
						width: 173px;
						text-align: center;
						.img{
							height: 249px;
						}
						p{
							font-size: 14px;
							margin-top: 7px;
							margin-bottom: 7px;
						}
						span{
							
							color: #6d6d6d;
							font-size: 12px;
						}
					}
					
				}
				
				
				
				.end{
					// width: 290px;
					height: 13px;
					display: flex;
					margin-left: 250px;
					margin-top: 66px;
					
					li{
						display: inline-block;
						margin-left: 7px;
						transition: all ease 0.1s; 
					}
					a{
						color: #747474;
						text-decoration: none;
						font-size: 12px;
						margin-left: 7px;
					}
					input{
						width: 29px;
						height: 13px;
						margin-left: 10px;
					}
				}
				
				
				li:hover a{
					color: #FFFFFF;
					background-color: #000000;
					border: 2px solid #000000;
				}
				
				
				
				
			}
			
			
			
			
			
			
			
			
		}
		
		
		
		
		
		
		
		

		
	}
	
	
	
	
	
	
	
	
	
	
	
	
	//尾部
	.footer{
		width: 73%;
		height: 286px;
		background: url(../首页图片/手表index23_10.jpg);
		margin-top: 48px;
		margin-left: 183px;
		.sale{
			width: 774px;
			// height: 165px;
			padding-top: 41px;
			margin-left: 111px;
			display: flex;
			justify-content: space-between;
			.hos{
				width: 200px;
				h3{
					font-size: 14px;
					color: #dcdcdc;
				}
				p{
					width: 200px;
					height: 1px;
					border-bottom: 1px solid #dbdbea;
					padding-top: 7px;
					margin-bottom: 11px;
				}
				li{
					font-size: 12px;
					color: #dcdcdc;
					margin-bottom: 18px;
				}
				a{
					color: #dcdcdc;
					text-decoration: none;
				}
			}
			
	
			
		}
		
		.ss{
			height: 16px;
			display: flex;
			margin-left: 88px;
			padding-top: 22px;
			p{
				font-size: 14px;
				color: #dcdcdc;
				margin-right: 40px;
			}
		}
	}





}